<template>
    <div class="vhome">
        <div class="vhome-header">
            <div class="container">
                <div class="main">
                    <h1 class="name"><span class="clip">轻松背默<br>
                            Easy Recite</span></h1>
                    <p class="text">Efficient memory <br>
                        intelligent planning <br>Reciting is easier</p>
                    <p class="tagline">Smart scheduling of study sessions.</p>
                    <div class="actions"><!--[-->
                        <div class="action"><a class="Button medium brand" href="#" @click.prevent="goToLogin">开始</a>
                        </div>
                        <div class="action"><a class="Button medium alt" href="#" target="_blank"
                                rel="noreferrer">帮助</a></div><!--]-->
                    </div>
                </div>
                <div class="image">
                    <div class="image-container">
                        <div class="image-bg">
                            <img class="image-bg-img" src="../assets/img/logo.svg" alt=""></img>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="vhome-features">
            <div class="container">
                <div class="items">
                    <div class="grid-4">
                        <div class="item">
                            <article class="box">
                                <svg t="1737019145878" class="icon" viewBox="0 0 1024 1024" version="1.1"
                                    xmlns="http://www.w3.org/2000/svg" p-id="1769" width="256" height="256">
                                    <path
                                        d="M850.367451 513.489934c4.208858-5.538133 8.271384-11.088546 12.139481-16.651238 55.695486-80.095199 69.303412-153.764036 38.315654-207.435423-30.986735-53.671387-101.583606-78.719876-198.802812-70.535473-6.750751 0.568958-13.588483 1.310855-20.488637 2.187829-2.691295-6.414083-5.467525-12.70844-8.350179-18.838044-41.517579-88.280626-98.512664-136.898927-160.487158-136.898927-61.974493 0-118.969579 48.618301-160.485111 136.898927-2.883677 6.130627-5.658883 12.423961-8.350179 18.839067-6.901177-0.876973-13.739932-1.61887-20.490683-2.187829-97.209996-8.18645-167.813007 16.865109-198.800765 70.535473-30.987758 53.671387-17.380856 127.340223 38.314631 207.435423 3.867074 5.561669 7.9296 11.113105 12.139481 16.651238-4.209882 5.538133-8.271384 11.088546-12.139481 16.651238-55.694463 80.095199-69.301366 153.764036-38.314631 207.434399 27.13808 47.004547 84.658122 72.055083 163.830299 72.055083 11.228739 0 22.897499-0.50449 34.970466-1.51961 6.750751-0.568958 13.589506-1.310855 20.490683-2.187829 2.691295 6.414083 5.467525 12.70844 8.351202 18.839067 41.515532 88.281649 98.510618 136.89995 160.485111 136.89995 61.974493 0 118.969579-48.618301 160.487158-136.89995 2.883677-6.130627 5.658883-12.423961 8.350179-18.839067 6.900154 0.876973 13.737886 1.61887 20.488637 2.187829 12.081153 1.01819 23.737634 1.51961 34.972513 1.51961 79.162968 0 136.693242-25.052582 163.830299-72.055083 30.986735-53.670363 17.379832-127.3392-38.315654-207.434399C858.639858 524.579503 854.577333 519.028067 850.367451 513.489934zM705.378266 258.742972c79.704296-6.715959 138.322345 11.755742 160.790056 50.669006 22.467711 38.914288 9.157567 98.901521-36.513612 164.583452-1.775436 2.554172-3.603061 5.106298-5.459339 7.656377-27.969005-31.598672-61.164035-62.346977-98.369402-91.212398-6.39464-46.653553-16.426111-90.774423-29.806863-130.796952C699.155541 259.309884 702.278671 259.003915 705.378266 258.742972zM603.368964 670.542876c-30.015617 17.32969-60.426231 32.621978-90.675162 45.690622-30.248931-13.068643-60.659545-28.360931-90.675162-45.690622-30.015617-17.32969-58.46353-36.019355-84.905762-55.680137-3.805676-32.730449-5.767354-66.712401-5.767354-101.371782 0-34.659381 1.961678-68.64338 5.768377-101.373829 26.442232-19.660782 54.890144-38.350446 84.904739-55.680137 30.015617-17.32969 60.427254-32.621978 90.675162-45.690622 30.248931 13.068643 60.658522 28.360931 90.675162 45.690622 30.016641 17.32969 58.464553 36.020378 84.907809 55.68116 3.805676 32.730449 5.768377 66.713424 5.768377 101.372805 0 34.659381-1.961678 68.641333-5.767354 101.370759C661.833517 634.522498 633.385605 653.213185 603.368964 670.542876zM679.918407 669.814282c-6.14393 32.457226-14.217816 63.196321-24.11728 91.542926-29.498848-5.600555-60.157101-13.977339-91.338265-24.885783 19.729344-9.582239 39.413662-20.017916 58.912761-31.275307C642.875746 693.938726 661.755746 682.109306 679.918407 669.814282zM460.924741 736.471424c-31.181163 10.908444-61.839417 19.285229-91.337241 24.885783-9.898441-28.346605-17.972327-59.0857-24.116257-91.541903 18.162662 12.295024 37.041638 24.12342 56.539714 35.380812C421.510056 716.454532 441.194374 726.889185 460.924741 736.471424zM293.701159 580.147076c-25.037233-21.548782-47.620577-43.911092-67.219961-66.657142 19.599384-22.74605 42.183751-45.108361 67.219961-66.658166-1.566682 21.877263-2.371 44.142359-2.371 66.658166C291.330158 536.00574 292.134477 558.269813 293.701159 580.147076zM345.471242 357.163539c6.14393-32.457226 14.217816-63.195298 24.116257-91.541903 29.497824 5.600555 60.156078 13.977339 91.336218 24.885783-19.729344 9.582239-39.413662 20.016893-58.912761 31.275307C382.511857 333.040119 363.633904 344.868515 345.471242 357.163539zM564.463885 290.50742c31.18014-10.907421 61.838394-19.284205 91.337241-24.885783 9.898441 28.346605 17.97335 59.0857 24.11728 91.542926-18.162662-12.295024-37.042661-24.124444-56.541761-35.381835C603.877547 310.524313 584.193229 300.088636 564.463885 290.50742zM731.688491 446.832791c25.036209 21.548782 47.620577 43.911092 67.219961 66.657142-19.599384 22.745027-42.182728 45.107337-67.219961 66.656119 1.566682-21.87624 2.371-44.141336 2.371-66.656119C734.059492 490.974128 733.255173 468.710055 731.688491 446.832791zM388.417357 219.247446c34.046421-72.393797 79.343069-113.913423 124.276445-113.913423s90.230024 41.519626 124.275421 113.913423c1.324158 2.815115 2.619664 5.67321 3.900843 8.55484-41.349757 8.422833-84.576257 21.796422-128.176264 39.584554-43.600007-17.788132-86.826508-31.16172-128.176264-39.584554C385.798716 224.919632 387.094222 222.061538 388.417357 219.247446zM195.73494 473.994408c-45.672202-65.680908-58.980299-125.669164-36.513612-164.583452 19.435655-33.662681 65.900919-52.022841 129.693828-52.022841 9.952676 0 20.338211 0.447185 31.096229 1.353834 3.099594 0.260943 6.222725 0.567935 9.359158 0.899486-13.379729 40.021505-23.411199 84.142375-29.806863 130.794905-37.205367 28.865421-70.400397 59.613726-98.370425 91.213421C199.338001 479.099682 197.510376 476.54858 195.73494 473.994408zM320.010361 768.235872c-79.70839 6.711865-138.322345-11.754718-160.790056-50.667983-22.466688-38.913265-9.157567-98.902544 36.513612-164.582429 1.775436-2.554172 3.603061-5.105275 5.458315-7.655354 27.970028 31.598672 61.165058 62.346977 98.370425 91.211375 6.39464 46.65253 16.426111 90.7734 29.806863 130.794905C326.234109 767.667937 323.109955 767.974929 320.010361 768.235872zM636.969223 807.733445c-34.046421 72.392774-79.343069 113.912399-124.275421 113.912399s-90.230024-41.519626-124.276445-113.912399c-1.324158-2.815115-2.620687-5.674233-3.900843-8.556886 41.35078-8.422833 84.577281-21.797445 128.177288-39.585577 43.601031 17.788132 86.827531 31.16172 128.177288 39.584554C639.58991 802.059212 638.293381 804.918329 636.969223 807.733445zM866.168322 717.567889c-22.467711 38.913265-81.075527 57.387012-160.790056 50.667983-3.099594-0.260943-6.222725-0.567935-9.359158-0.899486 13.380752-40.021505 23.412223-84.143399 29.806863-130.795928 37.205367-28.864398 70.399373-59.612703 98.369402-91.210351 1.855254 2.550079 3.682879 5.102205 5.459339 7.656377C875.325889 618.667392 888.633986 678.654624 866.168322 717.567889z"
                                        fill="#2c2c2c" p-id="1770"></path>
                                </svg>
                                <h2 class="title">智能学习规划</h2>
                                <p class="details">自动生成科学的复习计划，帮助学生有效记忆生字和诗词，避免遗忘.
                                </p>
                            </article>
                        </div>
                    </div>
                    <div class="grid-4">
                        <div class="item">
                            <article class="box">
                                <svg t="1737019218959" class="icon" viewBox="0 0 1078 1024" version="1.1"
                                    xmlns="http://www.w3.org/2000/svg" p-id="2898" width="256" height="256">
                                    <path
                                        d="M391.275789 531.402105c0-12.934737-9.701053-38.804211-23.713684-38.804211-85.153684 0-139.048421-61.44-139.048421-151.983158s53.894737-147.671579 139.048421-151.983158c17.246316-1.077895 26.947368-19.402105 23.713684-38.804211-3.233684-12.934737-9.701053-23.713684-23.713684-23.713684-111.023158 0-198.332632 95.932632-198.332632 213.423158 0 78.686316 39.882105 147.671579 99.166316 184.32-126.113684 46.349474-215.578947 174.618947-215.578947 323.368421 0 12.934737 9.701053 23.713684 22.635789 23.713684s33.414737 3.233684 36.648421-23.713684c19.402105-160.606316 106.711579-278.096842 256.538947-278.096842C380.496842 568.050526 391.275789 544.336842 391.275789 531.402105z"
                                        fill="#272636" p-id="2899"></path>
                                    <path
                                        d="M923.755789 656.437895c-1.077895-1.077895-52.816842-56.050526-113.178947-82.997895-16.168421-7.545263-31.258947-12.934737-45.271579-18.324211 67.907368-51.738947 113.178947-142.282105 113.178947-230.669474 0-135.814737-108.867368-247.915789-243.604211-247.915789s-243.604211 111.023158-243.604211 247.915789c0 93.776842 52.816842 175.696842 128.269474 217.734737C362.172632 591.764211 246.837895 743.747368 246.837895 921.6c0 12.934737 10.778947 19.402105 23.713684 23.713684 14.012632 4.311579 36.648421-10.778947 36.648421-23.713684 0-191.865263 137.970526-321.212632 326.602105-321.212632 4.311579 1.077895 10.778947 1.077895 19.402105 0 0 0 66.829474-4.311579 111.023158 10.778947 62.517895 22.635789 113.178947 78.686316 116.412632 81.92 53.894737 63.595789 85.153684 143.36 85.153684 230.669474 0 12.934737 20.48 26.947368 36.648421 23.713684 12.934737-3.233684 22.635789-10.778947 22.635789-23.713684C1025.077895 824.589474 990.585263 729.734737 923.755789 656.437895zM455.949474 324.446316c0-101.322105 81.92-184.32 181.086316-184.32s181.086316 81.92 181.086316 184.32c0 101.322105-81.92 184.32-181.086316 184.32S455.949474 425.768421 455.949474 324.446316z"
                                        fill="#272636" p-id="2900"></path>
                                </svg>
                                <h2 class="title">家长辅助管理</h2>
                                <p class="details">自定义添加和整理生字，实时掌握孩子的学习进度，为个性化教育提供支持.
                                </p>
                            </article>
                        </div>
                    </div>
                    <div class="grid-4">
                        <div class="item">
                            <article class="box">
                                <svg t="1737019289702" class="icon" viewBox="0 0 1024 1024" version="1.1"
                                    xmlns="http://www.w3.org/2000/svg" p-id="3931" width="256" height="256">
                                    <path
                                        d="M482.728585 789.528976L860.55961 411.598049c1.698341-1.698341 2.497561-3.996098 2.297756-6.293854l-25.475122-301.105951c-0.699317-7.79239-6.793366-13.886439-14.585756-14.585756L521.690537 64.237268c-2.297756-0.199805-4.695415 0.599415-6.293854 2.297756L137.565659 444.366049c-3.096976 3.096976-3.096976 8.192 0 11.288975l333.873951 333.873952c3.096976 3.196878 8.192 3.196878 11.288975 0z m62.538927-651.064196l224.380878 18.981464 18.981464 224.380878L477.034146 693.322927 233.671805 450.060488l311.595707-311.595708z m60.100308 186.044317a47.953171 47.953171 0 1 0 67.813776-67.816773 47.953171 47.953171 0 1 0-67.813776 67.816773zM888.832 539.273366l-39.561366-39.461464c-3.096976-3.096976-8.192-3.096976-11.288975 0l-361.64683 360.947513-237.368195-236.768781c-3.096976-3.096976-8.192-3.096976-11.288975 0l-39.561366 39.461464c-3.096976 3.096976-3.096976 8.192 0 11.288975l242.962731 242.563122 39.561366 39.461464c3.096976 3.096976 8.192 3.096976 11.288976 0l406.902634-406.203318c3.096976-3.096976 3.096976-8.192 0-11.288975z"
                                        fill="#000000" p-id="3932"></path>
                                </svg>
                                <h2 class="title">记忆状态标注</h2>
                                <p class="details">提供记忆状态标记，直观展示学习效果.
                                </p>
                            </article>
                        </div>
                    </div>
                    <div class="grid-4">
                        <div class="item">
                            <article class="box">
                                <svg t="1737019318249" class="icon" viewBox="0 0 1025 1024" version="1.1"
                                    xmlns="http://www.w3.org/2000/svg" p-id="4990" width="256" height="256">
                                    <path
                                        d="M1002.331307 372.622222c-31.288889-36.977778-82.488889-42.666667-119.466667-11.377778l-372.622222-227.555555c-2.844444-17.066667-8.533333-31.288889-19.911111-45.511111-31.288889-36.977778-82.488889-42.666667-119.466667-11.377778-17.066667 14.222222-25.6 34.133333-28.444444 54.044444L140.46464 250.311111c-22.755556-19.911111-51.2-25.6-79.644444-17.066667-45.511111 14.222222-71.111111 59.733333-56.888889 105.244445 8.533333 34.133333 39.822222 56.888889 71.111111 59.733333l48.355555 213.333334C100.642418 625.777778 83.575751 654.222222 83.575751 682.666667c0 48.355556 36.977778 85.333333 85.333333 85.333333 19.911111 0 39.822222-8.533333 54.044445-19.911111l201.955555 119.466667c0 5.688889-2.844444 11.377778-2.844444 17.066666 0 48.355556 36.977778 85.333333 85.333333 85.333334s85.333333-36.977778 85.333334-85.333334c0-14.222222-2.844444-28.444444-8.533334-39.822222l315.733334-338.488889c28.444444 11.377778 62.577778 8.533333 88.177777-11.377778 39.822222-31.288889 45.511111-85.333333 14.222223-122.311111zM854.420196 475.022222L544.375751 804.977778c-8.533333-2.844444-14.222222-5.688889-22.755555-5.688889l-45.511112-213.333333c34.133333-17.066667 59.733333-51.2 62.577778-93.866667l315.733334-17.066667zM456.197973 819.2l-201.955555-119.466667c0-5.688889 2.844444-11.377778 2.844444-17.066666 0-8.533333-2.844444-17.066667-5.688889-25.6l105.244445-85.333334c17.066667 14.222222 39.822222 22.755556 65.422222 22.755556l45.511111 213.333333-11.377778 11.377778z m-275.911111-219.022222l-48.355555-213.333334 184.888889 79.644445c0 5.688889-2.844444 11.377778-2.844445 17.066667 0 17.066667 2.844444 31.288889 8.533333 45.511111l-105.244444 82.488889c-11.377778-5.688889-22.755556-11.377778-36.977778-11.377778z m-11.377778-301.511111l187.733334-108.088889c2.844444 2.844444 2.844444 5.688889 5.688889 8.533333 11.377778 11.377778 22.755556 19.911111 36.977777 25.6v150.755556c-25.6 5.688889-45.511111 19.911111-59.733333 39.822222l-170.666667-73.955556c0-14.222222 2.844444-28.444444 0-42.666666z m327.111112-108.088889L854.420196 409.6v8.533333l-324.266667 19.911111c-14.222222-31.288889-42.666667-54.044444-73.955556-62.577777V224.711111c8.533333-2.844444 17.066667-8.533333 25.6-14.222222 5.688889-5.688889 11.377778-11.377778 14.222223-19.911111z"
                                        p-id="4991"></path>
                                </svg>
                                <h2 class="title">多维学习</h2>
                                <p class="details">支持多种学习内容，包括生字、词语、诗词等，全面提升学生综合能力.
                                </p>
                            </article>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="vhome-footer"></div>
    </div>

</template>

<script setup>
import { useRouter } from 'vue-router'

// 获取路由器实例
const router = useRouter()

// 定义 goToLogin 方法来导航到登录页面
const goToLogin = () => {
    console.log('Navigating to login...')
    router.push({ name: 'Login' })
}
</script>

<style scoped>
    @import url("@/assets/css/vhome.css");
</style>